<template>
  <div class="user-list-search">
    <el-row>
      <el-col :span="3">
        <el-input v-model="param.keyWord" placeholder="请输入关键字"></el-input>
      </el-col>
      <el-col :span="21" class="button-class">
        <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
        <el-button type="primary" icon="el-icon-share" @click="reset">重置</el-button>
        <el-button type="primary" icon="el-icon-plus" @click="add">添加</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'CommoditySearch',
  data () {
    return {
      param: {
        keyWord: ''
      }
    }
  },
  methods: {
    // 搜索
    search () {
      this.$emit('search', this.param)
    },
    // 重置
    reset () {
      this.param.keyWord = ''
      this.$emit('reset')
    },
    // 添加
    add () {
      this.$emit('add')
    }

  }
}
</script>
<style>
.user-list-search{
  width: 100%;
  margin-bottom: 1rem;
}
.button-class{
  display: flex;
  padding-left: 1rem;
}
</style>
